<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>预约地址</title>
    <script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
    <script src="../plugins/healthmobile.js"></script>
    <script src="../js/vue.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <!--    <script src="https://unpkg.com/element-ui/lib/index.js"></script>-->
    <script src="../js/axios-0.18.0.js"></script>
    <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"/>
    <script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
    <script type="text/javascript"
            src="http://webapi.amap.com/maps?v=1.4.15&key=2cf5fcd8c3c0f969590834a513776a95&plugin=AMap.PlaceSearch,AMap.Geolocation,AMap.Geocoder,AMap.Driving"></script>
    <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
    <script type="text/javascript" src="https://cache.amap.com/lbs/static/PlaceSearchRender.js"></script>
    <script>
        //?latitude=117.081295,36.671987
        // var latitude = getUrlLatitude('latitude');

    </script>
    <style>
        /*#container {
            width: 400px;
            height: 180px;
        }*/
        html, body, #container {
            height: 100%;
            width: 100%;
        }

        #panel {
            position: fixed;
            background-color: white;
            max-height: 90%;
            overflow-y: auto;
            top: 10px;
            right: 10px;
            width: 280px;
        }

        #panel .amap-call {
            background-color: #009cf9;
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
        }

        #panel .amap-lib-driving {
            border-bottom-left-radius: 4px;
            border-bottom-right-radius: 4px;
            overflow: hidden;
        }
    </style>
</head>
<body>
<div id="container"></div>
<div id="panel"></div>
<div class="info">
</div>
</body>

<script>

    // var url = 'http://webapi.amap.com/maps?v=1.4.15&key=2cf5fcd8c3c0f969590834a513776a95&callback=onload';
    var url = 'http://webapi.amap.com/maps?v=1.4.15&key=2cf5fcd8c3c0f969590834a513776a95';
    console.log(url)
    //初始化地图
    // window.onload = function () {
    var latitude = getUrlLatitude('latitude');
    // console.log(latitude)
    let arr = new Array();
    if (latitude) {
        arr = latitude.split(',');
    }
    var longitudeNum = parseFloat(arr[0]);
    var latitudeNum = parseFloat(arr[1]);
    let posArr = new Array();
    posArr.push(longitudeNum);
    posArr.push(latitudeNum);
    var map = new AMap.Map('container', {
        resizeEnable: true,
        zoom: 14,//级别
        // center: posArr,//中心点坐标
        // viewMode: '3D'//使用3D视图
    });

    //构造路线导航类
    var driving = new AMap.Driving({
        map: map,
        panel: "panel"
    });
    // 根据起终点经纬度规划驾车导航路线
    // driving.search(new AMap.LngLat(pos0, pos1), new AMap.LngLat(posArr[0],posArr[1]), function (status, result) {


    var geolocation = new AMap.Geolocation({
        enableHighAccuracy: true,//是否使用高精度定位，默认:true
        timeout: 10000,          //超过10秒后停止定位，默认：5s
        buttonPosition: 'RB',    //定位按钮的停靠位置
        buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
        zoomToAccuracy: true,   //定位成功后是否自动调整地图视野到定位点

    });
    map.addControl(geolocation);
    geolocation.getCurrentPosition(function (status, result) {
        if (status == 'complete') {
            onComplete(result)
        } else {
            onError(result)
        }
    });

    let pos0 = null;
    let pos1 = null;


    //解析定位结果
    function onComplete(data) {
        var str = [];

        driving.search([data.position.lng,data.position.lat], posArr, function (status, result) {

            // result 即是对应的驾车导航信息，相关数据结构文档请参考  https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
            if (status === 'complete') {
                log.success('绘制驾车路线完成')
            } else {
                log.error('获取驾车数据失败：' + result)
            }
        });
    }


    //解析定位错误信息
    function onError(data) {
        document.getElementById('status').innerHTML = '定位失败'
        document.getElementById('result').innerHTML = '失败原因排查信息:' + data.message;
    }

   /* //构造路线导航类
    var driving = new AMap.Driving({
        map: map,
        panel: "panel"
    });
    // 根据起终点经纬度规划驾车导航路线
    // driving.search(new AMap.LngLat(pos0, pos1), new AMap.LngLat(posArr[0],posArr[1]), function (status, result) {
    driving.search([117.081295,36.671987], posArr, function (status, result) {

        // result 即是对应的驾车导航信息，相关数据结构文档请参考  https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
        if (status === 'complete') {
            log.success('绘制驾车路线完成')
        } else {
            log.error('获取驾车数据失败：' + result)
        }
    });*/
    // }


</script>
</html>